<template>
    <div style="height: 100%;">
      <el-container>
        <el-header>
          <el-button @click="cancel">返回</el-button>
        </el-header>
        <div>
        <el-table :data="tableData"
        :header-cell-style="{background:'#3DC5A1',color:'#555'}"
        :border="true">
        <el-table-column prop="questionNum" label="题目题号" width="250">
        </el-table-column>
        <el-table-column prop="question" label="题目" width="250">
        </el-table-column>
        <el-table-column prop="option1" label="选项1" width="250">
        </el-table-column>
        <el-table-column prop="option2" label="选项2" width="250">
        </el-table-column>
        <el-table-column prop="option3" label="选项3" width="250">
        </el-table-column>
        <el-table-column prop="option4" label="选项4" width="250">
        </el-table-column>
        </el-table>
        </div>
      </el-container>
    </div>
  </template>
  
  <script>
  export default {
    name: "QUestionaire",
    data() {
      return{
        tableData:[],
        id: '',
      }
    },
    mounted() {
        // this.id = this.$route.params.id;
        this.loadPost();
      },
    methods: {
        loadPost() {
          console.log();
        this.$axios.get(`http://localhost:8082/questionaire-info/${this.$route.params.questionaireId}`).then(res => res.data).then(res => {
          console.log(res);
          if (res.code == 200) {
            this.tableData = res.data;
          } else {
            alert("获取失败");
          }
        });
      },
      cancel() {
        this.$router.push('/QuestionMange');
      },
      
    }
  };
  </script>
  
  <style scoped>
  .el-header, .el-footer {
    width: 100%;
    height: 50px;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: flex-start; /* 修改为 flex-start 以使按钮靠左 */
  }
  
  .textarea-input {
    width: 100%;
    border: 1px solid black;
    resize: none; /* 防止用户拖动改变文本框大小 */
  }
  </style>
  